<!DOCTYPE html>
<html lang="en">

<head>
    <title></title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Set render engine for 360 browser -->
    <meta name="renderer" content="webkit">
    <link rel="stylesheet" type="text/css" href="css/iconfont/iconfont.css">
    <link rel="stylesheet" type="text/css" href="./AmazeUI/assets/css/amazeui.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <script type="text/javascript" src="./js/common/jquery-1.9.1.js"></script>
    <script type="text/javascript" src="AmazeUI/assets/js/amazeui.js"></script>
    <script type="text/javascript" src="js/plugin/layer/layer.js"></script>
    <script type="text/javascript" src="js/plugin/jquery.ba-throttle-debounce.min.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
</head>

<body>
    <div class="coms-layout-container theme-default">
        <!-- 头部  start****************************************************** -->
        <div class="coms-layout-header">
            <a href="#" class="logo"></a>
            <ul class="header-nav">
                <li class="active"><a href="">首页</a></li>
                <li><a href="">社区</a></li>
                <li><a href="">好店</a></li>
                <li><a href="">行业</a></li>
                <li><a href="">白卡</a></li>
            </ul>
            <div class="header-userinfo">
                <a class="info-name" href="javascript:;">onetao<span class="arrow"></span></a>
                <ul class="dropdown-list">
                    <li><a href="#">操作1</a></li>
                    <li><a href="#">操作2</a></li>
                    <li><a href="#">操作3</a></li>
                </ul>
            </div>
            <div class="header-notice">
                <a class="tit" href="javascript:;">通知<b><i>8</i></b></a>
                <ul class="dropdown-list">
                    <li><a href="#">操作1</a></li>
                    <li><a href="#">操作2</a></li>
                    <li><a href="#">操作31</a></li>
                </ul>
            </div>
        </div>
        <!-- 头部  end****************************************************** -->
        <!-- side  start****************************************************** -->
        <div class="coms-layout-aside">
            <div class="aside-unfold"><i class="iconfont f18">&#xe6d4;</i></div>
            <div class="aside-menu-scroll">
                <ul class="aside-menu">
                    <li class="treeview active hactive">
                        <a href="javascript:void(0)" data-tip="榜单管理">
                    <i class="iconfont f14">&#xe65d;</i>
                    <span class="txt">榜单管理</span>
                    <span class="more"></span> 
                </a>
                        <ul class="treeview-menu">
                            <li>
                                <a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14"></i><span class="txt">榜单管理1-1</span></a>
                            </li>
                            <li class="treeview active hactive">
                                <a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;</span>
                             <i class="iconfont f14">&#xe65d;</i>
                            <span class="txt">榜单管理1-2</span>
                            <span class="more"></span> 
                        </a>
                                <ul class="treeview-menu">
                                    <li class="current"><a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14">&#xe65d;</i><span class="txt">榜单管理1-2-1</span></a></li>
                                    <li><a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14">&#xe65d;</i><span class="txt">榜单管理1-2-2</span></a></li>
                                    <li><a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14">&#xe65d;</i><span class="txt">榜单管理1-2-3</span></a></li>
                                    <li><a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14">&#xe65d;</i><span class="txt">榜单管理1-2-4</span></a></li>
                                </ul>
                            </li>
                            <li class="current"><a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14">&#xe65d;</i><span class="txt">榜单管理1-3</span></a></li>
                            <li><a href="#"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;</span><i class="iconfont f14">&#xe65d;</i><span class="txt">榜单管理1-4</span></a></li>
                        </ul>
                    </li>
                    <li class="current">
                        <a href="javascript:void(0)" data-tip="榜单管理">
                    <i class="iconfont f14">&#xe65d;</i>
                    <span class="txt">榜单管理</span>
                    <span class="more"></span> 
                </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- side  end****************************************************** -->
        <script type="text/javascript">
        (function($) {
            $(function() {
                var $a = $(".aside-menu").find('.treeview').children('a');
                var $parent;
                var $aside = $(".coms-layout-aside");
                var $body = $("#J_coms-layout-body");
                $.each($a, function(index, el) {
                    $(el).on("click", function() {
                        var $this = $(this);
                        $parent = $this.parent("li");
                        if ($parent.hasClass('hactive')) {
                            $parent.removeClass('hactive');
                        } else {
                            $parent.addClass('hactive');
                        }
                    })
                });
                $(".aside-unfold").on("click", function() {
                    if ($aside.hasClass('fold')) {
                        $aside.removeClass('fold');
                        $body.removeClass('unfold');
                    } else {
                        $aside.addClass('fold');
                        $body.addClass('unfold');
                        $aside.find(".treeview").removeClass('hactive');
                    }
                })
            })
        })(jQuery)
        </script>
        <div class="coms-layout-body p15" id="J_coms-layout-body">
            <div class="coms-elem-quote am-cf">
                <span class="fl f16">通用框架示范</span>
                <ol class="am-breadcrumb fr p0 m0">
                    <li><a href="#">首页</a></li>
                    <li><a href="#">分类</a></li>
                    <li class="am-active">内容</li>
                </ol>
            </div>
            <!--  table 表格样式************************************* -->
            <div class="pb50"></div>
           
            
            <!--  表单验证************************************* -->
           
            <script type="text/javascript" src="js/plugin/webuploader-0.1.5/webuploader.min.js"></script>
            <link rel="stylesheet" type="text/css" href="js/plugin/webuploader-0.1.5/webuploader.css" />
            <form action="" class="am-form am-form-horizontal" data-am-validator>
                <div class="am-form-group">
                    <label class="am-para-label">用户名：</label>
                    <div class="am-para-input">
                        <input type="text" minlength="3" placeholder="输入用户名(至少 3 个字符)" required />
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">密码：</label>
                    <div class="am-para-input">
                        <input type="text" placeholder="请输入密码" required/>
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">邮箱：</label>
                    <div class="am-para-input">
                        <input type="email" placeholder="邮箱" required/>
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">封面图片(头像):</label>
                    <div class="am-para-input">
                        <div class="coms-upload-single-box">
                            <div class="no-pic" id="J_no-pic"></div>
                            <ul class="uploading-img-list clearfix" id="J_uploader-list">
                            </ul>
                           
                            <div class="upload-btn-group clearfix">
                                <span class="mask"></span>
                                <div id="filePicker" class="filepicker-container">
                                    
                                </div>
                            </div>
                        </div>
                       
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">封面图片(头像)-上传步骤: </label>
                    <div class="am-para-input">
                        <div class="coms-upload-single-box">
                            <ul class="uploading-img-list clearfix" id="J_uploader-list">
                                <li>
                                    <div class="img-wrap preview">预览中...</div>
                                    <div class="handle-bar">
                                        <span class="del-btn">删除</span>
                                        <span class="upload-btn">上传</span>
                                    </div>
                                    <p class="progressing">
                                        <span style="width:0;"></span>
                                    </p>
                                    <span class="error">上传失败</span>
                                </li>
                                <li>
                                    <div class="img-wrap">
                                        <img src="upload/icon_perssion_1.png" />
                                    </div>
                                    <div class="handle-bar" style="display:block;">
                                        <span class="del-btn">删除</span>
                                        <span class="upload-btn">上传</span>
                                    </div>
                                    <p class="progressing">
                                        <span style="width:0;"></span>
                                    </p>
                                    <span class="error">上传失败</span>
                                    <span class="success"></span>
                                </li>
                                <li>
                                    <div class="img-wrap">
                                        <img src="upload/icon_perssion_1.png" />
                                    </div>
                                    <div class="handle-bar">
                                        <span class="del-btn">删除</span>
                                        <span class="upload-btn">上传</span>
                                    </div>
                                    <p class="progressing" style="display:block;">
                                        <span style="width:50%;"></span>
                                    </p>
                                    <span class="error">上传失败</span>
                                    <span class="success"></span>
                                </li>
                                <li>
                                    <div class="img-wrap">
                                        <img src="upload/icon_perssion_1.png" />
                                    </div>
                                    <div class="handle-bar">
                                        <span class="del-btn">删除</span>
                                        <span class="upload-btn">上传</span>
                                    </div>
                                    <p class="progressing">
                                        <span style="width:0%;"></span>
                                    </p>
                                    <span class="error" style="display: block;">上传失败</span>
                                    <span class="success"></span>
                                </li>
                                <li>
                                    <div class="img-wrap">
                                        <img src="upload/icon_perssion_1.png" />
                                    </div>
                                    <div class="handle-bar">
                                        <span class="del-btn">删除</span>
                                        <span class="upload-btn">上传</span>
                                    </div>
                                    <p class="progressing">
                                        <span style="width:50%;"></span>
                                    </p>
                                    <span class="success" style="display: block;"></span>
                                </li>
                            </ul>
                        </div>
                       
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">选择框：</label>
                    <div class="am-para-input">
                        <select required name="pro">
                            <option value="">请选择</option>
                            <option value="option1">选项一...</option>
                            <option value="option2">选项二.....</option>
                            <option value="option3" disabled>选项三........</option>
                        </select>
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">选择框：</label>
                    <div class="am-para-inline w150 mr10">
                        <select required name="province">
                            <option value="">省</option>
                            <option value="option1">选项一...</option>
                            <option value="option2">选项二.....</option>
                            <option value="option3" disabled>选项三........</option>
                        </select>
                    </div>
                    <div class="am-para-inline w150 mr10">
                        <select required name="city">
                            <option value="">市</option>
                            <option value="option1">选项一...</option>
                            <option value="option2">选项二.....</option>
                            <option value="option3" disabled>选项三........</option>
                        </select>
                    </div>
                    <div class="am-para-inline w150 mr10">
                        <select required name="district">
                            <option value="">区</option>
                            <option value="option1">选项一...</option>
                            <option value="option2">选项二.....</option>
                            <option value="option3" disabled>选项三........</option>
                        </select>
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">文本域：</label>
                    <div class="am-para-input">
                        <textarea rows="5" minlength="2" maxlength="100000" required></textarea>
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label">编辑器：</label>
                    <div class="am-para-input">
                        <textarea id="container" required name="content" type="text/plain">这里写你的初始化内容
                        </textarea>
                        <script type="text/javascript" src="js/plugin/ueditor1_4_3/ueditor.config.js"></script>
                        <!-- 编辑器源码文件 -->
                        <script type="text/javascript" src="js/plugin/ueditor1_4_3/ueditor.all.js"></script>
                        <!-- 实例化编辑器 -->
                        <script type="text/javascript">
                        var ue = UE.getEditor('container');
                        </script>
                    </div>
                </div>
                <div class="am-form-group">
                    <label class="am-para-label"></label>
                    <div class="am-para-input">
                        <button class="am-btn am-btn-secondary" type="submit">提交</button>
                    </div>
                </div>
            </form> 
        </div>
    </div>
     <script type="text/javascript" src="js/webupload.js"></script>
</body>

</html>